
<template>
  <el-dialog
    title="关联徽章任务"
    :visible.sync="_visible"
    width="80%"
    append-to-body
  >
    <avue-crud
      v-if="visible"
      ref="crud"
      v-model="form"
      :data="tableData"
      :page.sync="page"
      :table-loading="tableLoading"
      :option="tableOption"
      :before-open="beforeOpen"
      :upload-change="$uploadChange"
      :upload-exceed="uploadExceed"
      :upload-error="uploadSizeError"
      @on-load="getList"
      @search-change="searchChange"
      @search-reset="searchReset"
      @row-update="handleUpdate"
      @row-save="handleSave"
      @row-del="handleDelete"
    >
      <!-- <template #menuLeft>
        <el-button
          type="primary"
          size="default"
          @click="handleSave"
        >新增</el-button>
      </template> -->
      <template #menu="{row}">
        <el-button
          type="text"
          @click="edit(row)"
        >编辑</el-button>
        <el-button
          v-if="row.status === BADGE_STATUS.CLOSE"
          type="text"
          @click="open(row)"
        >开启</el-button>
        <el-button
          v-if="row.status === BADGE_STATUS.CLOSE"
          type="text"
          @click="handleDelete(row)"
        >删除</el-button>
      </template>
    </avue-crud>
  </el-dialog>
</template>

<script>
import crudMixins from '@/mixins/crud';
import { tableOption } from '@/const/crud/customer-system/task';
import {
  getBadgeList,
  openBadge,
  deleteBadge,
  editBadge,
  addBadge,
} from '@/api/core/badge';
import { BADGE_STATUS } from '@/const/type';
export default {
  name: 'badgeDialog',
  components: {},
  mixins: [crudMixins],
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    taskId: {
      type: [Object, String],
    },
  },
  data() {
    return {
      form: {},
      addVisible: false,
      attributeCodeList: [],
      formType: '',
      formData: {},
      BADGE_STATUS,
      status: '',
    };
  },
  computed: {
    _visible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit('update:visible', val);
      },
    },
    tableOption() {
      return tableOption(this.status === BADGE_STATUS.OPEN);
    },
  },
  methods: {
    // 获取列表
    async getList(page, refresh) {
      if (refresh) {
        this.page.current = 1;
        this.page.currentPage = 1;
      }
      try {
        this.tableLoading = true;
        const { data } = await getBadgeList({
          taskId: this.taskId,
          size: this.page.pageSize,
          current: this.page.currentPage,
          ...this.searchForm,
        });
        this.tableData = data.data.records;
        this.page.total = data.data.total;
        this.tableLoading = false;
      } catch (error) {
        this.tableLoading = false;
        throw new Error(error);
      }
    },
    async open(row) {
      try {
        await openBadge(row.id);
        this.$message.success('操作成功');
        this.getList(this.page, true);
      } catch (error) {
        throw new Error(error);
      }
    },
    edit(row, index) {
      this.status = row.status;
      this.$refs.crud.rowEdit(row, index);
    },
    // 编辑
    async handleUpdate(row, index, done, loading) {
      const params = {
        taskId: this.taskId,
        ...row,
      };
      try {
        await editBadge(params);
        done();
        this.$message.success('操作成功');
        this.getList(this.page, true);
      } catch (error) {
        loading();
        throw new Error(error);
      }
    },
    // 保存
    async handleSave(row, done, loading) {
      const params = {
        taskId: this.taskId,
        ...row,
      };
      try {
        await addBadge(params);
        done();
        this.$message.success('操作成功');
        this.getList(this.page, true);
      } catch (error) {
        loading();
        throw new Error(error);
      }
    },
    // 删除
    handleDelete: function (row, index) {
      this.$confirm('是否确认删除该徽章!', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(async () => {
        await deleteBadge(row.id);
        this.$message.success('删除成功');
        this.getList();
      });
    },
    beforeOpen(done) {
      done();
    },
    uploadSizeError(error, limitedSize) {
      // console.log(134, error, limitedSize);
      if (error === '文件太大不符合') {
        this.$message.warning(
          `文件大小不能超过${limitedSize.fileSize / 1024}M`
        );
      }
    },
    uploadExceed(limit, files, fileList, column) {
      this.$message.error(`只能上传${limit}个文件`);
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
